:root {
  --lookbook-white: theme("colors.white");
  --lookbook-accent-50: theme("colors.blue.50");
  --lookbook-accent-100: theme("colors.blue.100");
  --lookbook-accent-200: theme("colors.blue.200");
  --lookbook-accent-300: theme("colors.blue.300");
  --lookbook-accent-400: theme("colors.blue.400");
  --lookbook-accent-500: theme("colors.blue.500");
  --lookbook-accent-600: theme("colors.blue.600");
  --lookbook-accent-700: theme("colors.blue.700");
  --lookbook-accent-800: theme("colors.blue.800");
  --lookbook-accent-900: theme("colors.blue.900");
  --lookbook-base-50: theme("colors.zinc.50");
  --lookbook-base-100: theme("colors.zinc.100");
  --lookbook-base-200: theme("colors.zinc.200");
  --lookbook-base-300: theme("colors.zinc.300");
  --lookbook-base-400: theme("colors.zinc.400");
  --lookbook-base-500: theme("colors.zinc.500");
  --lookbook-base-600: theme("colors.zinc.600");
  --lookbook-base-700: theme("colors.zinc.700");
  --lookbook-base-800: theme("colors.zinc.800");
  --lookbook-base-900: theme("colors.zinc.900");
  --lookbook-text: var(--lookbook-base-800);
  --lookbook-divider: var(--lookbook-base-300);
  --lookbook-draggable-hint: rgb(224 231 255 / 0.2);
  --lookbook-icon-button-stroke: var(--lookbook-base-400);
  --lookbook-icon-button-stroke-hover: var(--lookbook-accent-600);
  --lookbook-button-bg: var(--lookbook-accent-500);
  --lookbook-button-bg-hover: var(--lookbook-accent-600);
  --lookbook-button-text: var(--lookbook-white);
  --lookbook-tooltip-bg: var(--lookbook-accent-500);
  --lookbook-tooltip-text: var(--lookbook-white);
  --lookbook-dropdown-bg: var(--lookbook-toolbar-bg);
  --lookbook-dropdown-text: var(--lookbook-text);
  --lookbook-dropdown-divider: var(--lookbook-divider);
  --lookbook-scrollbar: var(--lookbook-base-200);
  --lookbook-scrollbar-hover: var(--lookbook-base-300);
  --lookbook-toolbar-bg: var(--lookbook-white);
  --lookbook-toolbar-divider: var(--lookbook-divider);
  --lookbook-nav-text: var(--lookbook-text);
  --lookbook-nav-toggle: var(--lookbook-base-500);
  --lookbook-nav-icon-stroke: var(--lookbook-accent-500);
  --lookbook-nav-item-hover: var(--lookbook-base-100);
  --lookbook-nav-item-active: var(--lookbook-accent-50);
  --lookbook-input-bg: var(--lookbook-white);
  --lookbook-input-border: var(--lookbook-base-300);
  --lookbook-input-border-focus: var(--lookbook-accent-200);
  --lookbook-input-text: var(--lookbook-base-600);
  --lookbook-input-text-placeholder: var(--lookbook-base-400);
  --lookbook-input-toggle: var(--lookbook-base-300);
  --lookbook-input-toggle-active: var(--lookbook-accent-500);
  --lookbook-prose-bg: var(--lookbook-white);
  --lookbook-prose-text: var(--lookbook-base-600);
  --lookbook-prose-link: var(--lookbook-accent-900);
  --lookbook-tabs-text: var(--lookbook-base-500);
  --lookbook-tabs-text-hover: var(--lookbook-base-700);
  --lookbook-tabs-text-disabled: var(--lookbook-base-300);
  --lookbook-tabs-border-active: var(--lookbook-accent-400);
  --lookbook-viewport-handle: var(--lookbook-white);
  --lookbook-viewport-handle-hover: var(--lookbook-draggable-hint);
  --lookbook-viewport-handle-icon-stroke: var(--lookbook-base-300);
  --lookbook-viewport-handle-icon-stroke-hover: var(--lookbook-base-700);
  --lookbook-sidebar-bg: var(--lookbook-base-50);
  --lookbook-page-bg: var(--lookbook-white);
  --lookbook-drawer-bg: var(--lookbook-base-50);
  --lookbook-params-editor-bg: var(--lookbook-white);
  --lookbook-header-bg: var(--lookbook-accent-600);
  --lookbook-header-text: var(--lookbook-white);
  --lookbook-header-border: var(--lookbook-accent-700);
  --lookbook-message-bg: var(--lookbook-white);
  --lookbook-message-border: var(--lookbook-divider);
  --lookbook-message-title: var(--lookbook-base-600);
  --lookbook-message-text: var(--lookbook-text);
  --lookbook-page-header-bg: var(--lookbook-base-50);
  --lookbook-page-header-text: var(--lookbook-text);
  --lookbook-page-header-border: var(--lookbook-divider);
  --lookbook-embed-title: var(--lookbook-text);
  --lookbook-branding-text: var(--lookbook-header-text);
}